<%--
  User: Alex Kasianik
  Date: 17.08.12
  Time: 6:03
--%>

<script type="text/javascript">

    jq(function () {
        jq("#grid").jqGrid({
            url:'/admin/userslist',
            datatype:'json',
            mtype:'GET',
            colNames:['ID', 'Employee Name', 'Employee Email','Approver'],
            colModel:[
                {name:'id',index:'id',editable:false,editoptions:{readonly:true,size:10},hidden:true},
                {name:'name', index:'employee_name', width:55, align:"center", editable:false},
                {name:'email', index:'email', width:55, align:'center', editable:false},
                {name:'isApprover', index:'approver', width:55, align:'center', editable:true, edittype:'checkbox', editoptions:{ value:"True:False"}, formatter:"checkbox", formatoptions:{disabled:false},sortable:false }
            ],
            postData:{
            },
            rowNum:20,
            rowList:[20, 40, 60],
            height:200,
            autowidth:true,
            rownumbers:true,
            pager:'#pager',
            sortname:'employee_name',
            viewrecords:true,
            sortorder:"asc",
            caption:"Roles",
            emptyrecords:"Empty records",
            loadonce:false,
            loadComplete:function () {
            },
            gridComplete:function () {
                var ids = jQuery("#grid").jqGrid('getDataIDs');
                for (var i = 0; i < ids.length; i++) {
                    var recordId = ids[i];
                    generate_button = "<input style='height:22px;width:50px;' type='button' value='Generate' onclick=\"#\"  />";
                    jQuery("#grid").jqGrid('setRowData', ids[i], {act:generate_button});
                }
            },
            jsonReader:{
                root:"rows",
                page:"pageNumber",
                total:"pageCount",
                records:"recordsCount",
                repeatitems:false,
                cell:"cell",
                id:"id"
            }
        });
        jq("#grid").jqGrid('navGrid', '#pager',
                {edit:false, add:false, del:false, search:true},
                { },
                { },
                { },
                {
                    sopt:['eq', 'ne', 'lt', 'gt', 'cn', 'bw', 'ew'],
                    closeOnEscape:true,
                    multipleSearch:true,
                    closeAfterSearch:true }
        );

    });
</script>

<div id="jqgrid">
    <table id="grid"></table>
    <div id="pager"></div>
</div>